* {
  margin: 0;
  padding: 0;
  border: 0;
}
html,body{
  height: 100%;
}
.header{
  width:100%;
  height:60px;
  background-color:#0f88eb;
  position: fixed;
    top:0;
}
.syone{
  width: 300px;
  float: left;
  margin-left: 16px;
}
.sytwo{
  width:200px;
  margin:0 auto;
}
.sythree{
  width:400px;
  float:right;
}
.wenzi a{
  color:white;
  margin-left:20px;
}
.wenzi{
  margin-top:15px;
}
.you{
  float: right;
  margin-right: 16px;
}
.Transformers5{
  height: 100%;
  background-image: url("../image/Transformers5.4.jpg");
  background-size: cover;
  background-attachment: fixed;
  margin-top: 60px;
}
.box1{
  height: 100%;
  opacity: 0.4;
  background-color: #fff;
}
.main1{
  height:300px;
  width: 500px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -250px;
  margin-top: -150px;
}
.main1 img{
  position: absolute;
  height: 100%;
  width: auto;
}
.foot1{
  position: absolute;
  bottom: 10%;
  width: 100%;
}
.name{
  text-align: center;
  font-style:normal;
  font-weight: bold;
  font-size: 300%;
  font-family: sans-serif;
}
.Fast8{
  height: 100%;
  background-image: url("../image/Fast 8.jpg");
  background-size: cover;
  background-attachment: fixed;
}
.main2{
  height: 500px;
  width: auto;
  position: absolute;
  right: 30%;
}
.main2 img{
  position: absolute;
  height: 100%;
  width: auto;
}
.box2{
  position: absolute;
  top: 180%;
  right: 5%;
  font-style: italic;
  font-weight: bold;
  font-size: 200%;
  font-family: serif;
}
.Thegreatwall{
  height: 100%;
  background-image: url("../image/The Great wall.jpg");
  background-size: cover;
  background-attachment: fixed;
}
.box3 {
  height: 100%;
  width: 100%;
  overflow: hidden;
}
.box3 img{
  height:100%;
  width:4000px;
  opacity: 0;
}
